<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Insert title here</title>
<script src="/scripts/boot.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<script type="text/javascript">
	mini.parse();
	var i ;
	function SetData(data) {
       console.info(data);
       data = mini.clone(data);
       i = data.id;
	 }
$(function(){
    // 获取上传文件名称
    $('#file').change(function () {
        var str = $(this).val();
        var fileName = getFileName(str);
        var fileExt = str.substring(str.lastIndexOf('.') + 1); 
        if(fileExt!="xls"){
            alert("请选择excel文档导入");
            return;
        }
        $("#fileName").text(fileName);
        $(".file_div").show();
        $(".choose").hide();
        // alert(fileName + "\r\n" + fileExt);
    });
    // 点击提交
	 $("#btnSubmit").click(function (event) {
	        event.preventDefault();
	        fire_ajax_submit(i);
    });
});
function setData(num){
	mini.get("num").setValue(num.num);
}

function fire_ajax_submit(i) {
    // Get form
    var form = $('#fileUploadForm')[0];
    var data = new FormData(form);
    data.append("id", i);
    var file = document.querySelector('[type=file]')
    data.append('file', file.files[0]);
    $("#btnSubmit").prop("disabled", true);
    $.ajax({
        type: "POST",
        enctype: 'multipart/form-data',
        url: "/perMonPlan/importExcel",
        data: data,
        processData: false,
        contentType: false,
        cache: false,
        timeout: 600000,
        success: function (data) {
           CloseWindow('close');
           window.Owner.setSuccess();

        },
        error: function (e) {

            $("#result").text(e.responseText);
            console.log("ERROR : ", e);
            $("#btnSubmit").prop("disabled", false);

        }
    });
    //关闭窗口
    function CloseWindow(action) {
        if (window.CloseOwnerWindow) return window.CloseOwnerWindow(action);
        else window.close();
    }

}

//获取文件名称
function getFileName(path) {
    var pos1 = path.lastIndexOf('/');
    var pos2 = path.lastIndexOf('\\');
    var pos = Math.max(pos1, pos2);
    if (pos < 0) {
        return path;
    }
    else {
        return path.substring(pos + 1);
    }
}
// 删除文件
function delfile(){
    $('.file_div').empty();
    $(".choose").show();
}
</script>
<style>
	.mini-fit{
        vertical-align: middle;
    }
	.choose{
		border: 1px dashed #cccccc;
		width: 296px;
		height: 80px;
        margin: 0 auto;
	}
    .clickA{
        width: 296px;
        height: 80px;
        line-height: 80px;
        color: #cccccc;
        font-size: 14px;
        text-align: center;
        display: block;
        cursor: pointer;
        position: relative;
    }
    .file{  
        filter:alpha(opacity:0);
        opacity: 0;
        width:100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }
    
    .blue{
        color: #0098fe;
    }
    .file_div{
    	width: 100%;
    	line-height: 28px;
        position: relative;
        display: none;
    }
    .file_div span{
        font-size: 14px;
    }
    .file-bg{
    display: inline-block;
    width:28px;
    height:28px;
    vertical-align: middle;
    background: url(/image/excel.png) no-repeat center center;
    margin-right: 5px;
    margin-top: -2px;
}
.del_a{
    text-align: right;
    position: absolute;
    right: 0;
    top: 6px;
}
</style>
</head>
<body class="bg-white">
<div class="mini-fit">
<form method="POST" enctype="multipart/form-data" id="fileUploadForm">
	<div class="choose">
        <a class="clickA">
            点击<span class="blue">浏览</span>上传
         <input type="file" name="file" class="file" id="file" />
        </a>
    </div>
    <div class="file_div">
        <a class="file-bg"></a><span id="fileName"></span><a class="delAll del_a" onclick="delfile()">删除</a>
    </div>
    <!-- <input type="submit" value="保存" id="btnSubmit"/> -->
	</form>
	<input name="num" id="num" class="mini-hidden" style="width:100%;" />
<pre>
    <span id="result"></span>
</pre>
</div>
<div class="chose-toolbar">
   <a class="chose-button" onclick="CloseWindow('close')">取消</a>
   <a class="chose-button save-button" id="btnSubmit" href="">保存</a>
</div>
</body>
</html>
